<template>
  <div class="template-management">
    <go-back title="工作信息列表" />
    <w-block class="body" title="任务信息列表" style="margin-top: 10px">
      <zk-table
        :columns="tableColumns"
        :service="service"
        :query="query"
        :actions="actions"
        :request-interceptor="interceptor"
        @doOtherAction="doActions"
      >
      </zk-table>
    </w-block>
    <w-dialog :visible.sync="visible" height="auto" title="时效设置">
      <el-form
        ref="modelForm"
        :model="model"
        label-width="200px"
        :rules="rules"
      >
        <el-row>
          <el-col
            v-for="item of formColumns"
            :key="item.key"
            :span="item.span || 22"
          >
            <el-form-item
              :label="item.label"
              :prop="item.key"
              :rules="
                item.required && [
                  {
                    required: true,
                    message: `请输入${item.label}`,
                    trigger: ['blur'],
                  },
                ]
              "
            >
              <zk-item-pool
                v-model="model[item.key]"
                :option="{ ...item, disabled: item.disabled }"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <div class="flex-end">
          <el-button type="default" @click="visible = false">取 消</el-button>
          <el-button type="primary" @click="submit">保 存</el-button>
        </div>
      </template>
    </w-dialog>
  </div>
</template>
<script>
import { taskAgingSettings as service } from "@/services";
import { TYPE_ENUM }                    from "@/common/zk-constants";
import GoBack                           from "@/components/go-back";
import SearchTableCRUDMixin             from "@/mixins/search-table-crud-mixin";

const actions = [{ classname: "primary", text: "时效设置", type: "review" }];

export default {
  mixins    : [SearchTableCRUDMixin],
  components: { GoBack },
  data() {
    const warnValidate = (rule, value, callback) => {
      if (value <= 0) {
        callback(new Error("提醒时限需大于0"));
      }
      if (!value || value > 0) {
        callback();
      }
    };
    const firstValidate = (rule, value, callback) => {
      // const { tip_day = 0 } = this.model;
      if (value <= 0) {
        callback(new Error("一次预警时限需大于0"));
      }
      else {
        callback();
      }
      // if (!value || value > tip_day) {
      //   callback();
      // } else {
      //   callback(new Error("一次预警时限需大于提醒时限"));
      // }
    };
    const secondValidate = (rule, value, callback) => {
      const { warn_first_day = 0 } = this.model;
      if (value <= 0) {
        callback(new Error("二次预警时限需大于0"));
      }
      if (!value || value > warn_first_day) {
        callback();
      }
      else {
        callback(new Error("二次预警时限需大于一次预警时限"));
      }
    };
    return {
      columns   : [
        { label: "任务序号", key: "ord", table: true },
        { label: "任务名称", key: "task_name", table: true, required: true },
        { label: "所需要上传的附件", key: "item_name", table: true },
        {
          label   : "完成时限",
          key     : "dur_time",
          table   : true,
          form    : true,
          type    : TYPE_ENUM.LABEL,
          required: true,
        },
        {
          label: "提醒时限",
          key  : "tip_day",
          table: true,
          form : true,
          type : TYPE_ENUM.NUMBER,
        },
        {
          label: "一次预警时限",
          key  : "warn_first_day",
          table: true,
          form : true,
          type : TYPE_ENUM.NUMBER,
        },
        {
          label: "二次预警时限",
          key  : "warn_second_day",
          table: true,
          form : true,
          type : TYPE_ENUM.NUMBER,
        },
      ],
      rules     : {
        tip_day        : [
          { validator: warnValidate, trigger: "blur" },
          { required: true, message: "请输入提醒时限", trigger: "blur" },
        ],
        warn_first_day : [
          { validator: firstValidate, trigger: "blur" },
          { required: true, message: "请输入一次预警时限", trigger: "blur" },
        ],
        warn_second_day: [
          { validator: secondValidate, trigger: "blur" },
          { required: true, message: "请输入二次预警时限", trigger: "blur" },
        ],
      },
      service,
      actions,
      isAddModal: false,
    };
  },
  methods   : {
    async doActions({ row }) {
      this.model = { ...row };
      this.visible = true;
    },
    interceptor(query) {
      return { ...query, work_id: this.$route.params.parentId };
    },
  },
};
</script>
<style scoped lang="scss">
</style>
